/**
 * Auther: MaiJZ
 * Date: 2017/12/4
 * Github: https://github.com/maijz128
 */

// 一个常见的`webpack`配置文件
const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');


module.exports = {
    entry: {
        // 'vendor': ['jquery'],
        'index': './src/main.js',
    },
    output: {
        publicPath: 'http://localhost:8094/', //CDN URL 静态文件
        path: __dirname + '/public', //打包后的文件存放的地方
        filename: '[name].bundle.js' //打包后输出文件的文件名
    },
    devtool: 'none',
    devServer: {
        contentBase: "./public",//本地服务器所加载的页面所在的目录
        historyApiFallback: true,//不跳转
        inline: true,//实时刷新
        hot: true
    },
    module: {
        loaders: [
            // expose-loader将需要的变量从依赖包中暴露出来
            { test: require.resolve("jquery"), loader: "expose?$! expose?jQuery" }
        ],
        rules: [
            {
                test: /(\.jsx|\.js)$/,
                use: {
                    loader: "babel-loader",
                    options: {presets: ["es2015"]}
                },
                exclude: /node_modules/
            },
            {test: /\.txt$/, use: 'raw-loader'},
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: [{
                        loader: "css-loader",
                        options: {modules: false}
                    }],
                })
            },
            {test: /\.less$/, loader: ExtractTextPlugin.extract('style', 'css!less')},
            {test: /\.ts$/, use: 'ts-loader'},
            // image & font
            {test: /\.(woff|woff2|eot|ttf|otf)$/i, loader: 'url-loader?limit=8192&name=[name].[ext]'},
            {test: /\.(jpe?g|png|gif|svg)$/i, loader: 'url-loader?limit=8192&name=[name].[ext]'},
        ]
    },
    plugins: [
        new webpack.BannerPlugin('版权所有，翻版必究'),
        // 分离css
        new ExtractTextPlugin('[name].bundle.css', {allChunks: true}),
        // 为组件分配ID，通过这个插件webpack可以分析和优先考虑使用最多的模块，并为它们分配最小的ID
        new webpack.optimize.OccurrenceOrderPlugin(),
        // 压缩混淆JS代码
        new webpack.optimize.UglifyJsPlugin({
            mangle: {
                except: ['$super', '$', 'exports', 'require']
                //以上变量‘$super’, ‘$’, ‘exports’ or ‘require’，不会被混淆
            },
            compress: {warnings: false}
        }),
        // 把jquery作为全局变量插入到所有的代码中
        // 然后就可以直接在页面中使用jQuery了
        new webpack.ProvidePlugin({
            $: 'jquery', jQuery: 'jquery', 'window.jQuery': 'jquery'
        }),
        // public sources
        // new webpack.optimize.CommonsChunkPlugin({
        //     // 与 entry 中的 vendor 对应
        //     name: 'vendor',
        //     // 输出的公共资源名称
        //     filename: 'common.bundle.js',
        //     // 对所有entry实行这个规则
        //     minChunks: Infinity
        // }),
    ]
};
 